import { createRouter, createWebHistory, RouteRecordRaw } from 'vue-router'
import Home from '../views/Home.vue'

const routes: Array<RouteRecordRaw> = [
  {
    path: '/',
    name: 'Home',
    component: Home
  },
  {
    path: '/about',
    name: 'About',
    component: () => import('../views/About.vue')
  },
  {
    path: '/undo',
    name: 'undo',
    component: () => import('../views/undo/index.vue')
  },
  {
    path: '/transitions',
    name: 'transitions',
    component: () => import('../views/transitions/index.vue')
  },
  {
    path: '/switch',
    name: 'switch',
    component: () => import('../views/transitions/switch.vue')
  },
  {
    path: '/transform',
    name: 'transform',
    component: () => import('../views/transform/index.vue')
  },
  {
    path: '/tool/clean',
    name: 'toolClean',
    component: () => import('../views/tools/clean.vue')
  },
  {
    path: '/tool/contextmenu',
    name: 'toolContextMenu',
    component: () => import('../views/tools/contextmenu.vue')
  },
  {
    path: '/tool/tooltip',
    name: 'tooltip',
    component: () => import('../views/tools/tooltip.vue')
  },
  {
    path: '/token',
    name: 'token',
    component: () => import('../views/token/index.vue')
  },
  {
    path: '/stencil',
    name: 'stencil',
    component: () => import('../views/stencil/index.vue')
  },
  {
    path: '/snapline',
    name: 'snapline',
    component: () => import('../views/snapline/index.vue')
  },
  {
    path: '/shap',
    name: 'shap',
    component: () => import('../views/shap/index.vue')
  },
  {
    path: '/xml-markup',
    name: 'xml-markup',
    component: () => import('../views/shap/xml-markup.vue')
  },
  {
    path: '/standard',
    name: 'standard',
    component: () => import('../views/shap/standard.vue')
  },
  {
    path: '/helloworld',
    name: 'helloworld',
    component: () => import('../views/shap/helloworld.vue')
  },
  {
    path: '/custom-node',
    name: 'custom-node',
    component: () => import('../views/shap/custom-node.vue')
  },
  {
    path: '/coord',
    name: 'coord',
    component: () => import('../views/shap/coord.vue')
  },
  {
    path: '/basic',
    name: 'basic',
    component: () => import('../views/shap/basic.vue')
  },
  {
    path: '/shap/flowchart',
    name: 'shap-flowchart',
    component: () => import('../views/shap/flowchart/index.vue')
  },
  {
    path: '/selection',
    name: 'selection',
    component: () => import('../views/selection/index.vue')
  },
  {
    path: '/scroller',
    name: 'scroller',
    component: () => import('../views/scroller/index.vue')
  },
  {
    path: '/router',
    name: 'router',
    component: () => import('../views/router/index.vue')
  },
  {
    path: '/router/orth',
    name: 'router-orth',
    component: () => import('../views/router/orth.vue')
  },
  {
    path: '/react',
    name: 'react',
    component: () => import('../views/react/index.vue')
  },
  {
    path: '/react/label',
    name: 'react-label',
    component: () => import('../views/react/label.vue')
  },
  {
    path: '/react/port',
    name: 'react-port',
    component: () => import('../views/react/port.vue')
  },





]

const router = createRouter({
  history: createWebHistory(process.env.BASE_URL),
  routes
})

export default router
